<template>
    <Dialog
v-model="dialogVisible" width="700px" :title="`站点设置[${info?.domainName}] `" maxHeight="450px"
        @close="closeHandle">
        <el-tabs tab-position="left" style="height: 100%" class="">
            <el-tab-pane label="域名管理">
                <Domains :info="info" />
            </el-tab-pane>
            <el-tab-pane label="配置文件">
                <Config :info="info" />
            </el-tab-pane>
            <el-tab-pane label="重定向">
                <RedirectLIst :info="info" :webInfo="webInfo" @confirm="searchHandle" />
            </el-tab-pane>
            <el-tab-pane label="反向代理"> <ProxyList :info="info" :webInfo="webInfo" @confirm="searchHandle" /></el-tab-pane>
            <el-tab-pane label="流量控制"><Webedit :info="info" :webInfo="webInfo" @confirm="searchHandle" /></el-tab-pane>
        </el-tabs>
    </Dialog>
</template>
<script setup lang="ts">
import { ref, watch, defineEmits, reactive, onMounted } from 'vue'
import { webInfoPhpWebAPI } from "@/api/systemMonitor/site"
import { propTypes } from '@/utils/propTypes'
import Domains from './Domains.vue'
import Config from './Config.vue'
import RedirectLIst from './RedirectLIst.vue'
import ProxyList from './ProxyList.vue'
import Webedit from './Webedit.vue'

const emit = defineEmits(['update:modelValue'])

const props = defineProps({
    modelValue: propTypes.bool.def(false),
    info: propTypes.object.def(undefined)
})

//弹出框状态
const dialogVisible = ref(props.modelValue)
let webInfo = ref(undefined) //网站信息

watch(() => props.modelValue, (newVal) => {
    dialogVisible.value = newVal;
    if (newVal) {
        searchHandle()
    }
})

onMounted(() => {

})

const getData = () => {
    webInfoPhpWebAPI({ domainName: props.info?.domainName }).then((res) => {
        webInfo.value = res.data;
    })
}
// 查询
const searchHandle = () => {
    getData();
}


//关闭
const closeHandle = () => {
    dialogVisible.value = false;
    //初始化数据
    emit('update:modelValue', dialogVisible)
}
</script>